import React from 'react'
import _ from 'underscore'
import TimeStore from 'lib/stores/time-store'
import GridWidget from 'lib/components/GridWidget.jsx'
import Modal from 'lib/components/Modal.jsx'
import {combAnalysisApi,combAnalysisDetailApi,sortMap,parseToChart,propConfig} from '../apis/core-util'
import Card from 'lib/components/card.jsx'
import detailGridCols from './detailGridCols.es6'
var classifyMapping = {
  'appversion':'appVersionId',
  'manufacturer':'manufacturerId',
  'osversion':'osVersionId',
  'crashname':'crashNameId',
  'domain':'domainId',
  'region':'regionId',
  'carries':'carriesId',
  'nettype':'netTypeId',
  'statuscode':'statusCode',
  'errorcode':'errorCode',
  'exceptiontype':'exceptionType'
}
export default class DetailModal extends Modal{
  constructor(props){
    super(props)
    this.state = {
      option:detailGridCols[props.category],
      grid:{
        loading:true
      }
    }
    var params = _.extend({},this.props.params,{
      urlName:this.state.option.urlName
    })
    if(this.props.params.classify){
      params[classifyMapping[this.props.params.classify]] = props.pId
    }
    if(this.props.params.classify==='statuscode'||this.props.params.classify==='errorcode'){
      params.codeEq = true
    }
    this.gridApi = combAnalysisDetailApi(params,TimeStore.getValue)
  }
  renderHeader(){
    return <h4>{this.props.name}</h4>
  }
  renderBody(){
    return (
      <div style={{minWidth:700,height:600,overflow:'auto'}}>
        <div className="pure-g">
          <div className="pure-u-1">
            <Card className="widget-float">
              <GridWidget cols={this.state.option.cols} store={this.state.grid}/>
            </Card>
          </div>
        </div>
      </div>
    )
  }
  renderFooter(){
    return null
  }
  componentDidMount(){
    super.componentDidMount()
    this.gridApi.fetch().then((data,params) => {
      this.setState({
        grid:{
          data:data,
          hasMore:data.length === params.limit,
          showMore:function(){
            return combAnalysisDetailApi(params,{
              offset:this.data.length
            }).fetch().then(function(innerData,innerParams){
              return {
                data:innerData,
                hasMore:data.length === innerParams.limit
              }
            })
          }
        }
      })
    })
  }
}
